body{margin:0;user-select:none;width:1920px;height:1080px;overflow:hidden;transform-origin:left top;position:absolute}#background{background-size:100% 100%}#background,#home{width:100%;height:100%}#home{display:grid;grid-template-rows:2fr 3fr;justify-items:center}.logo-home{position:absolute;width:302px;height:70px;bottom:2%;right:3%}#button-home{width:100px;object-fit:contain;position:fixed;left:3%;bottom:2%}.title-img{width:573px;height:136px;align-self:center;margin-left:-8%;margin-top:2%}.title-mascot{position:absolute;width:504px;height:581px;bottom:0;left:8%}#menu-bar{width:min-content;height:500px;flex-direction:column;gap:40px;margin-top:-2%;margin-right:-7%}#menu-bar,.menu-button{display:flex;align-items:center;justify-content:center}.menu-button{width:350px;height:100px;border-radius:60px;font-size:64px;font-weight:600;background-color:#fdd300;font-family:sans-serif;border:5px solid #fff}#explain{width:100%;height:100%;align-items:center}#explain,#explain-area{display:flex;flex-direction:column;justify-content:flex-start}#explain-area{position:relative;height:600px;width:1300px;align-items:flex-start;font-size:48px;font-family:sans-serif;background-size:100% 100%;background-repeat:no-repeat;margin-top:9%;padding:50px}.explain-position{position:absolute;top:0;left:37%;transform:translateY(-50%)}.explain-title{font-size:54px;font-weight:600;margin:0;text-decoration:underline #ea6000;text-underline-offset:10px}#game{width:100%;height:100%}.model-text{width:390px;height:390px;position:absolute;z-index:10;left:43%;top:7%}#button-girl{width:249px;height:249px;left:43.7%;bottom:27%}#button-boy,#button-girl{position:absolute;z-index:10;cursor:pointer}#button-boy{width:281px;height:281px;left:21.3%;bottom:36%}.image-girl{width:415px;height:511px;left:48%}.image-boy,.image-girl{position:absolute;z-index:20;bottom:0;pointer-events:none}.image-boy{width:312px;height:546px;left:28%}#play{grid-template-columns:1fr 1fr}#play,.preview-area{display:grid;width:100%;height:100%}.preview-area{grid-template-rows:8fr 1fr;justify-items:center;align-items:center;position:relative}#mask-canvas{position:absolute;margin:5.9% 0 0 11%;visibility:hidden;top:0}#mask-canvas,#preview-canvas{background-color:#fff;border-radius:50px;border:4px solid #00a199}#preview-canvas{margin:3% 0 0 11%}#button-top{top:26%}#button-bottom,#button-top{position:absolute;right:5%;cursor:pointer}#button-bottom{top:32%}#button-shoes{position:absolute;right:5%;top:38%;cursor:pointer}.play-menu-bar{display:flex;flex-direction:row;gap:15px;margin:-3% 0 0 7%}.play-control-button{background-color:#00a199;color:#fff;font-size:40px;padding:5px 15px;font-weight:600}.clothes-area{width:100%;height:100%;margin:-5% 0 0 -4%;display:flex;align-items:center;justify-content:center}#girl-bottom,#girl-top{display:grid;width:770px;height:870px;grid-template-rows:1fr 9fr}#boy-bottom,#boy-top{display:grid;width:770px;height:920px;grid-template-rows:1fr 10fr;margin-top:5%}#boy-shoes,#girl-shoes{display:grid;width:770px;height:670px;grid-template-rows:1fr 6fr}.clothes-title{background-color:#f8d0d3;box-shadow:0 5px 5px #999;z-index:2;position:relative}.clothes-title,.clothes-type{display:flex;justify-content:center;align-items:center}.clothes-type{width:200px;border-radius:40px;border:2px solid #2d68ae;background-color:#fff;font-size:36px;font-weight:600}.clothes-close-button{position:absolute;right:5%}#boy-bottom-window,#boy-shoes-window,#boy-top-window,#girl-bottom-window,#girl-shoes-window,#girl-top-window{background-color:#eaf5fc;position:relative}.boy_top_01{left:6%}.boy_top_01,.boy_top_02{position:absolute;top:2%}.boy_top_02{right:38%}.boy_top_03{position:absolute;top:2%;right:8%}.boy_top_04{position:absolute;bottom:33%;left:6%}.boy_top_05{position:absolute;bottom:31%;right:36%}.boy_top_06{position:absolute;bottom:46%;right:6%}.boy_top_07{left:9%}.boy_top_07,.boy_top_08{position:absolute;bottom:2%}.boy_top_08{left:37%}.boy_top_09{position:absolute;bottom:22%;right:10%}.boy_top_10{position:absolute;bottom:2%;right:3%}.boy_bottom_01{position:absolute;top:3%;left:6%}.boy_bottom_02{position:absolute;top:3%;left:28%}.boy_bottom_03{position:absolute;top:3%;right:32%}.boy_bottom_04{position:absolute;top:3%;right:8%}.boy_bottom_05{position:absolute;top:26%;right:8%}.boy_bottom_06{position:absolute;bottom:3%;left:6%}.boy_bottom_07{position:absolute;bottom:3%;left:28%}.boy_bottom_08{position:absolute;bottom:3%;right:32%}.boy_bottom_09{position:absolute;bottom:3%;right:8%}.boy_shoes_01{position:absolute;top:8%;left:12%}.boy_shoes_02{position:absolute;top:8%;left:38%}.boy_shoes_03{position:absolute;top:8%;right:12%}.boy_shoes_04{position:absolute;top:25%;left:12%}.boy_shoes_05{position:absolute;top:24%;left:38%}.boy_shoes_06{position:absolute;top:22%;right:12%}.boy_shoes_07{position:absolute;top:40%;left:12%}.boy_shoes_08{position:absolute;top:38%;left:38%}.boy_shoes_09{position:absolute;top:38%;right:12%}.boy_shoes_10{position:absolute;bottom:36%;left:6%}.boy_socks_01{position:absolute;bottom:22%;left:28%}.boy_socks_02{position:absolute;bottom:32%;right:28%}.boy_socks_03{position:absolute;bottom:28%;right:6%}.boy_socks_04{position:absolute;bottom:6%;left:6%}.boy_socks_05{position:absolute;bottom:5%;left:28%}.boy_socks_06{position:absolute;bottom:5%;right:28%}.boy_socks_07{position:absolute;bottom:10%;right:6%}.girl_top_01{position:absolute;top:3%;left:2%}.girl_top_02{position:absolute;top:3%;right:34%}.girl_top_03{position:absolute;top:3%;right:4%}.girl_top_04{position:absolute;bottom:27%;left:3%}.girl_top_05{position:absolute;bottom:3%;right:36%}.girl_top_06{position:absolute;bottom:35%;right:3%}.girl_top_07{left:1%}.girl_top_07,.girl_top_08{position:absolute;bottom:4%}.girl_top_08{left:22%}.girl_top_09{position:absolute;bottom:23%;right:8%}.girl_top_10{position:absolute;bottom:3%;right:5%}.girl_bottom_01{position:absolute;top:3%;left:3%}.girl_bottom_02{position:absolute;bottom:3%;left:3%}.girl_bottom_03{position:absolute;top:3%;left:30%}.girl_bottom_04{position:absolute;top:3%;right:12%}.girl_bottom_05{position:absolute;bottom:5%;left:32%}.girl_bottom_06{position:absolute;bottom:26%;right:8%}.girl_bottom_07{position:absolute;bottom:5%;right:8%}.girl_shoes_01{position:absolute;top:6%;right:30%}.girl_shoes_02{position:absolute;top:6%;right:6%}.girl_shoes_03{position:absolute;top:28%;right:30%}.girl_shoes_04{position:absolute;top:28%;right:6%}.girl_shoes_05{position:absolute;bottom:38%;right:30%}.girl_shoes_06{position:absolute;bottom:38%;right:6%}.girl_shoes_07{position:absolute;bottom:22%;right:30%}.girl_shoes_08{position:absolute;bottom:22%;right:6%}.girl_shoes_09{position:absolute;bottom:6%;right:30%}.girl_shoes_10{position:absolute;bottom:6%;right:6%}.girl_socks_01{position:absolute;top:10%;left:5%}.girl_socks_02{position:absolute;top:10%;left:27%}.girl_socks_03{position:absolute;bottom:30%;left:5%}.girl_socks_04{position:absolute;bottom:27%;left:27%}.girl_socks_05{position:absolute;bottom:5%;left:5%}.girl_socks_06{position:absolute;bottom:5%;left:27%}#color-dialog{position:absolute;display:grid;z-index:100;top:60%;left:10%;background-color:#fff;width:350px;height:600px;transform:translate(-50%,-50%);grid-template-rows:1fr 8fr 1fr;border:5px solid #00a199;border-radius:30px}.color-dialog-title{width:inherit;color:#000;display:flex;align-items:center;justify-content:center;font-size:36px;font-weight:600}.color-dialog-content{width:inherit;display:grid;grid-auto-flow:column;grid-template-rows:repeat(4,1fr);gap:10px;padding:5px 0}#color-area1,#color-area2,#color-area3,#color-area4{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(3,1fr);gap:2px;align-items:center;justify-items:center;margin:auto}.per-color{width:25px;height:25px;cursor:pointer;margin:2px}.white-color-border{border:1px solid #ccc;width:23px;height:23px}.selected-color{border:2px solid red;margin:0}#color-dialog-confirm{background-color:#00a199;color:#fff;font-size:32px;width:max-content;font-weight:600;padding:5px 15px;border-radius:20px}#export-dialog,#return-dialog{position:absolute;display:grid;z-index:100;top:50%;left:50%;background-color:#fff;width:730px;height:500px;transform:translate(-50%,-50%);grid-template-rows:1fr 3fr 1fr;border:2px solid #00a199}.dialog-title{color:#fff;background-color:#00a199;display:flex;align-items:center;justify-content:center;font-size:56px;font-weight:600}#color-dialog-close,#export-dialog-close,#return-dialog-close{position:absolute;right:5%}.dialog-content{padding:50px 20px 20px;display:grid;grid-template-columns:1fr 5fr}.dialog-header{justify-self:end;margin:8% 6% 0 0}.dialog-content input[type=checkbox]{width:46px;height:46px}.dialog-img,.dialog-text{font-weight:600;font-size:46px}.dialog-button-bar{width:inherit;display:flex;align-items:center;justify-content:space-around}#dialog-cancel,#dialog-confirm,#dialog-return{position:relative}#dialog-confirm{right:-30%}.dialog-button{background-color:#f5a301;color:#fff;font-size:48px;width:max-content;font-weight:600;padding:5px 15px;border-radius:20px}